<template>
	<div id="answer_period_add_edit">
		<div class="answer_newQuestion_title">{{title}}</div>
		<el-form label-width="1.2rem">
			<el-form-item label="阶段名称">
				<el-input class="input_txt" id="titleName" v-model="param.titleName" maxLength="30"></el-input>
			</el-form-item>
			<el-form-item>
				<el-button class="btn_sure" type="primary" @click="onSubmit()">确定</el-button>
				<el-button class="btn_cancle" @click="cancel()">取消</el-button>
			</el-form-item>
		</el-form>
	</div>
</template>

<script>
	var vm;
	export default {
		components: {},
		data: function() {
			return {
				title: "",
				param : {
					titleName : ""
				}
			}
		},
		methods: {
			init: function(period) {
				vm.title = (period.titleId? "修改闯关阶段" : "新建闯关阶段");
				vm.param = period;
			},
			onSubmit: function() {
				
				var rules = [{
					judge : vm.param.titleName,
					focus : $("#answer_period_add_edit #titleName"),
					tips : "请输入阶段名称"
				}];
				if(!tool.validate(rules)) {
					return;
				}
				api.questionAddEdit(vm.param).then(function(data) {
					vm.$emit('selectType', 1);
					let message = (vm.param.titleId? "阶段修改成功" : "阶段新建成功");
					tool.message({message: message, type:"success", showClose: true});
				})
						
			},
			cancel: function() {
				this.$emit('selectType', 1);
			},
		},
		mounted: function() {
			// vm.onClearCurIputData();
		},
		created: function() {
			vm = this;
		}
	}
</script>
<style lang="scss">
	#answer_period_add_edit {
		.el-form {
			width: 8.6rem;
			margin: 0 auto;
		}
		.el-form-item__label {
			font-size: 0.2rem;
			color: #666666;
		}
		.el-input__inner {
			font-size: 0.22rem;
			color: #999999;
		}
		.input_desc {
			.el-input__inner {
				//height: 1rem;
			}
		}
		.el-upload-list__item-name {
			font-size: 0.2rem;
			color: #999999;
			line-height: 0.4rem;
		}
		.el-icon-upload-success.el-icon-circle-check {
			width: 0.22rem;
			height: 0.22rem;
			text-align: center;
			align-items: center;
		}
		.el-upload-list__item.is-success .el-upload-list__item-status-label {
			top: 0.1rem;
		}
		.el-upload-list__item .el-icon-close {
			top: 0.14rem;
		}
		.el-upload-list__item .el-progress {
			bottom: 0rem;
		}
		.el-progress-bar {
			vertical-align: bottom;
		}
	}
</style>
<style scoped src="@/style/answer_system/answer_question_add_edit.css"></style>